<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title></title>
		<script src="../js/angular.js"></script>
	</head>

	<body ng-app="myApp">
		<div ng-controller="myCtrl">
			<p> 当前页面的url:</p>
			<h3>{{myUrl}}</h3>
		</div>
		<p>该实例使用了内建的 $location 服务获取当前页面的 URL。</p>

		<div ng-controller="myCtrl2">
			<p>欢迎信息:</p>
			<h1>{{myWelcome}}</h1>
		</div>
		<p> $http 服务向服务器请求信息，返回的值放入变量 "myWelcome" 中。</p>
		
		<div ng-controller="siteCtrl">
			<ul>
				<li ng-repeat="x in names">
					{{ x.Name + ', ' + x.Country }}
				</li>
			</ul>
		</div>
		
	</body>
	
	
	<script>
		var app = angular.module('myApp', []);
		app.controller('myCtrl', function($scope, $location) {
			$scope.myUrl = $location.absUrl();
			// $scope.myUrl = $location.path();
		});
	
		app.controller('myCtrl2', function($scope, $http) {
			$http.get("service.html").then(function(response) {
				$scope.myWelcome = response.data;
			});
		});
	
		app.controller('siteCtrl', function($scope, $http) {
			$http({
				method: 'GET',
				dataType:"jsonp",  //数据格式设置为jsonp
				crossDomain: true,
				url: 'https://www.runoob.com/try/angularjs/data/sites.php'
			}).then(function successCallback(response) {
				$scope.names = response.data.sites;
			}, function errorCallback(response) {
				// 请求失败执行代码
			});
	
		});
	</script>
	
	
</html>